<template>
    <view class="u-page" style="background-color: #ffffff;height: 100vh;overflow: hidden;">
      <view style="padding: 1vw">
        <view class="search-bar">
          <up-form>
          <up-form-item
              label="设备名称："
              labelWidth="auto">
          </up-form-item>
            <up-input v-model="search.equipmentName" placeholder="请输入设备名称"/>
            <up-form-item
                label="设备编号："
                labelWidth="auto">
            </up-form-item>
            <up-input v-model="search.equipmentNum" placeholder="请输入设备编号"/>
            <up-row style="margin-top: 10px">
              <up-button type="primary" style="width: 40%" @click="toSearch">查询</up-button>
              <up-button type="primary" style="width: 40%" @click="toReset">重置</up-button>
            </up-row>

          </up-form>
        </view>
      </view>
      <up-divider></up-divider>
      <view class="list-container" style="height: 70vh;overflow-y: scroll">
        <scroll-view
            refresher-enabled
            @refresherrefresh="pullDownList"
            :refresher-triggered="triggered"
        >
          <up-list>
            <up-list-item
                v-for="(item, index) in listData"
                :key="index">
              <up-swipe-action>
                <up-swipe-action-item
                    :options="options1"
                    @click="handleButtonClick1(item)"
                    :autoClose="false"
                >
                <up-cell>
                  <template #title>
                    <span style="font-weight: bold">设备名称：<span style="font-weight: lighter">{{item.equipmentName}}</span></span>
                    <span style="font-weight: bold">设备编号：<span style="font-weight: lighter">{{item.equipmentNum}}</span></span>
<!--                    <span style="font-weight: bold">创建人员：<span style="font-weight: lighter">{{item.creatorName}}</span></span>-->
                  </template>
                </up-cell>
                </up-swipe-action-item>
              </up-swipe-action>
            </up-list-item>
<!--            <up-loadmore :status="loadmoreStatus" @loadmore="scrolltolowerGetList" loadmoreText="点击加载更多"/>-->
          </up-list>
        </scroll-view>
      </view>
    </view>
</template>

<script setup>
import { ref } from 'vue';
import { getAllYqsygdList } from '@/api/system/sysIndex.js'
const listData = ref([]) // 存储分页数据
const search = ref({
  pageNum:1,
  pageSize:100,
  equipmentName:'',  //设备名称
  equipmentNum:'',  //设备编号
})

const options1 = ref([{
  text: '查看',
  style:{
    backgroundColor:'#3c9cff'
  }
}]);
const loadmoreStatus = ref('loadmore')
//查询
function toSearch(){
  pullDownList()
}
//重置
function toReset(){
  search.value = {
    pageNum:1,
    pageSize:100,
    equipmentName:'',  //设备名称
    equipmentNum:''  //设备编号
  }
  pullDownList()
}

//下拉刷新
const triggered=ref(false)
function pullDownList(){
  triggered.value = true
  getYqsygdList()
}

//查看仪器使用规定
function handleButtonClick1(item) {
  uni.navigateTo({
    url: `/pages/laboratory/yqsygdDetail?equipmentUsageRegulations=${item.equipmentUsageRegulations}&equipmentName=${item.equipmentName}&equipmentNum=${item.equipmentNum}&attachmentUrl=${item.attachmentUrl}&attachmentNames=${item.attachmentNames}`
  });
}
// //查询通知列表
function getYqsygdList(){
  search.value.pageNum = 1
  loadmoreStatus.value = 'loadmore'
  // 模拟请求后端接口获取分页数据
  getAllYqsygdList(search.value).then((response) => {
    listData.value = response.rows || [];
    setTimeout(()=>{
      triggered.value = false
    },1000)
  });
}
getYqsygdList()
</script>

<style lang="scss" scoped>

</style>
